@import "../../../../Public/css/core";
.rankTop{
  background-color: @themeColor;
  padding: .5rem;
  text-align: center;
  box-shadow: 0 2px 5px rgba(0,0,0,.2);
  position: relative;
  .rankTitle{
    text-align: center;
    color: @comColor;
    a{
      color: @comColor;
      position: absolute;
      left: .5rem;
    }
  }
  .myRank{
    padding: 1rem .5rem 0;
    .aWrap{
      .osCircle(70px);
      box-shadow: 0 0 5px rgba(0,0,0,.1);
      display: inline-block;
      position: relative;
      margin: 0 auto;
    }
    .hg{
      position: absolute;
      left: 22px;
      top:-35px;
      transform: scale(.5) rotate(30deg);
    }
    .myAvatar{
      overflow: hidden;
      border-radius: 100%;
      width: 100%;
      height: 100%;
    }
    .myNum{
      font-size: 25px;
      color: @comColor;
      line-height: 75px;
      width:100px;
      span{
        font-size: 14px;
        margin: 0 .4rem;
        opacity: .8;
      }
    }
  }
  .myName{
    margin-top: 8px!important;
    max-width: 300px;
  }
}

.rankList{
  background-color: @comColor;
  padding: 1rem .5rem;
  .buttons-row{
    background-color: #f5f6fb;
    border-radius: 1rem;
    .button{
      border: none;
      height: 2rem;
      line-height: 2rem;
      border-radius: 1rem;
      color: #000;
    }
    .active{
      color: @comColor;
      background-color: @themeColor;
    }
  }
}
.myEdge{
  padding: 0;
  margin: 1rem 0 0;
}
.inList{
  li{
    padding: .5rem 0;
    display: flex;
    justify-content: space-between;
    p{
      font-weight: 500;
    }
    .left{
      div{
        .comAvatar(40px);
        margin: 0 .8rem;
      }
      p:last-child{
        color: @themeColor;
      }
    }
    .right{
      font-size: 20px;
      sub{
        font-size: 10px;
        margin-left: .3rem;
        opacity: .8;
     }
    }
  }
}
//头像样式
.comAvatar(@diameter){
  width: @diameter;
  height: @diameter;
  border-radius: 100%;
  overflow: hidden;
  display: inline-block;
  position: relative;
  box-shadow: 0 0 5px rgba(0,0,0,.1);
}
.none{
  text-align: center;
  font-size: 20px;
}